<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body {
            border: 1px black solid;
        }
        .nav-box {
            height: 60px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .img-box {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-bottom: 20px;
        }
        .menu-box {
            display: flex;
            border-top: 1px gainsboro solid;
            align-items: center;
        }
        .titleimg {
            width: 30px;
        }
        .title {
            font-weight: 900;
        }
        .subtitle {
            font-size: 15px;
            color: #66B1C9;
        }
        .img {
            height: 292px;
            margin-bottom: 20px;
        }
        .imgdes {
            font-weight: 1000;
        }
        .img-box .imgdes span {
            color: #66B1C9;
        }
        .menu-box .leftimg {
            width: 60px;
            height: 60px;
            margin-right: 10px;
        }
        .menu-box .options-box {
            flex: 1;
            line-height: 15px;
        }
        .menu-box .top {
            font-weight: 900;
            font-size: 18px;
        }
        .menu-box .botton {
            font-size: 16px;
            color: gainsboro;
        }
        .menu-box .rightimg {
            width: 40px;
            height: 40px;
        }
    </style>
</head>
<body>
    <!-- 导航栏 -->
    <div class="nav-box">
        <img src="./file/assets/arrow-left.png" alt="" class="titleimg">
        <div class="title" >急速问诊</div>
        <div class="subtitle">问诊记录</div>
    </div>

    <!-- 图片 -->
     <div class="img-box">
        <img src="./file/assets/consult-fast.png" alt="" class="img">
        <div class="imgdes"><span>10s</span> 快速匹配专业医生</div>
     </div>

    <!-- 菜单1 -->
     <div class="menu-box">
        <img src="./file/assets/doctor.png" alt="" class="leftimg">
        <div class="options-box">
            <p class="top">三甲图文问诊</p>
            <p class="botton">三甲主治及以上级别医生</p>
        </div>
        <img src="./file/assets/arrow-right.png" alt="" class="rightimg">
     </div>
     <!-- 菜单2 -->
     <div class="menu-box">
        <img src="./file/assets/message.png" alt="" class="leftimg">
        <div class="options-box">
            <p class="top">普通图文问诊</p>
            <p class="botton">二甲主治及以上级别医生</p>
        </div>
        <img src="./file/assets/arrow-right.png" alt="" class="rightimg">
     </div>
</body>
</html>